<template>
    <div className="fixed-table">
        <basic-container>
            <br/>
            <el-form v-model="SearchForm" ref="searchUserByName" :inline="true">
                <el-form-item>
                    <el-input v-model="SearchForm.username" placeholder="请输入人才姓名"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="searchUser()">查询</el-button>
                </el-form-item>
            </el-form>
            <br/>
            <el-table
                    :data="tableData"
                    fit
                    empty-text="暂无数据"
                    style="width: 100%">
                <el-table-column
                        prop="boleName"
                        label="所属伯乐"
                        align="center"
                        header-align="center"
                        sortable
                        v-if=isShowBoleName>
                </el-table-column>
                <el-table-column
                        prop="name"
                        label="姓名"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="position"
                        label="期望职位"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="city"
                        label="期望城市"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="area"
                        label="期望行业"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="mobile"
                        label="联系电话"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="email"
                        label="电子邮件"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column
                        prop="gender"
                        label="性别"
                        align="center"
                        header-align="center"
                        :filters="[{ text: '男', value: 0 }, { text: '女', value: 1 }]"
                        filter-placement="bottom-end"
                >
                    <template slot-scope="scope">
                        <el-tag
                                :type="scope.row.gender === 0 ? 'primary' : 'danger'"
                                close-transition>{{scope.row.gender==0?'男':'女'}}
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column
                        prop="pubtime"
                        label="上传日期"
                        align="center"
                        header-align="center">
                </el-table-column>
                <el-table-column label="操作"
                                 align="center"
                                 header-align="center">
                    <template slot-scope="scope">
                        <!-- <el-button
                          size="mini"
                          @click="handleEdit(scope.$index, scope.row)">编辑</el-button> -->
                        <el-button
                                size="mini"
                                type="danger"
                                @click="handleDelete(scope.$index, scope.row)">删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <br/>
            <el-row type="flex" justify="center">
                <el-pagination
                        style="align-self:center"
                        background
                        layout="prev, pager, next"
                        :current-page="currentPage"
                        :page-count="totalPage"
                        @current-change="changePage">
                </el-pagination>
            </el-row>
        </basic-container>
    </div>
</template>

<script>
    import BasicContainer from '@vue-materials/basic-container'
    import Config from '@myconfig/config.min.js'
    import axios from 'axios'

    export default {
        components: {BasicContainer},
        name: 'FixedTable',

        data() {
            return {
                currentPage: 1,
                totalPage: 10,
                tableData: [],
                SearchForm: {
                    username: ''
                },
                isShowBoleName: true,
            }
        },
        methods: {
            handleEdit(index, row) {
                this.$message('编辑简历功能暂不开放，请谨慎添加~');
            },
            handleDelete(index, row) {
                this.$http.post(
                    Config.baseUrl + '/api/resume/delete/' + row.id
                ).then(function (rsp) {
                    switch (rsp.data.code) {
                        case 1:
                            this.$message('删除成功！');
                            break;
                        case 0:
                            this.$message('删除失败！');
                            break;
                        case 2:
                            this.$message('数据不存在，删除失败！');
                            break;
                        case -1:
                            this.$message(rsp.data.message);
                            break;
                    }
                })
                console.log(index, row);
            },
            getData(currentPage) {
                this.$http.get(Config.baseUrl + '/api/bole/resumes/' + currentPage).then(function (rsp) {
                    console.log('====================================');
                    console.log(rsp);
                    this.tableData = rsp.data.list
                    this.totalPage = rsp.data.pages
                    console.log('====================================');
                    // this.totalPage = rsp.data.pages

                }, function (error) {
                    console.log('====================================');
                    console.log(error);
                    console.log('====================================');
                })
            },
            changePage: function (currentPage) {
                console.log('====================================');
                console.log('pageÇhange new Page' + currentPage);
                console.log('====================================');
                this.getData(currentPage)
            },
            searchUser() {
                let _this = this;
                axios({
                    method: 'get',
                    url: Config.baseUrl + "/api/system/search/resume/" + _this.SearchForm.username,
                }).then(function (response) {
                    if (response.data.code != 1) {
                        _this.$notify({
                            title: '搜索失败',
                            message: response.data.message,
                            type: 'error'
                        });
                    } else {
                        _this.tableData = response.data.data;
                    }
                })
            },
            initModify() {
                let _this = this;
                axios({
                    method: 'get',
                    url: Config.baseUrl + "/api/user/now",
                }).then(function (response) {
                    if (response.data.code == 1) {
                        console.log(response.data.data.role );
                        if (response.data.data.role == 1) {
                            _this.isShowBoleName = false
                        }
                        else {

                        }
                    }
                })
            }
        },
        created() {
            console.log('====================================');
            console.log('created');
            console.log('====================================');
            this.getData(1);
            this.initModify();
        },
        mounted() {
            console.log('====================================');
            console.log('mounted');
            console.log('====================================');
        }
    }
</script>

<style>
    .fixed-table {

    }
</style>
